<!--退款审批流程-->
<template>
  <div>
    <a-card :bordered='false'>
      <f-search-form :more='false' @searchHandler='searchTable'>
        <f-search-form-item label='单号' name='paymentNo' />
        <f-search-form-item label='收款方' name='payeeName' />
      </f-search-form>
      <a-tabs @tabClick='tabClick' :defaultActiveKey='current' v-model='current' :animated='false'>
        <a-tab-pane tab='我的待办' key='form1'>
          <todo-no ref='form1' @changeTab='changeTab'></todo-no>
        </a-tab-pane>
        <a-tab-pane tab='办理中' key='form2'>
          <todo-yes ref='form2'></todo-yes>
        </a-tab-pane>
        <a-tab-pane tab='已办结' key='form3'>
          <tab3 ref='form3'></tab3>
        </a-tab-pane>
      </a-tabs>
    </a-card>
  </div>
</template>
<script>

import api from "../../js/api"
import TodoNo from "./tab1"
import TodoYes from "./tab2"
import Tab3 from "./tab3"

export default {
  name: "Tabs",
  components: { TodoNo, TodoYes,Tab3 },
  data() {
    let me = this
    return {
      api: Object.assign(api, this.api),
      //列表初始化查询参数
      queryParam: {},
      current: "form1",
      forms: [
        "form1",
        "form2"
      ]
    }
  },
  created() {
  },
  methods: {
    tabClick(name) {
      this.current = name
      this.$nextTick(() => {
        this.searchTable()
      })
    },
    changeTab() {
      this.tabClick("form2")
    },
    searchTable(searchParams) {
      this.$refs[this.current].searchTable(searchParams)
    }
  }
}
</script>
